<template>
<section class="errorIndex page">
<div>
  <h1>404</h1>
  <p class="describe" @click="handleTest">哎呀！您查看的页面走丢了呢。</p>
</div>
</section>
</template>

<script>
export default {
  name: 'errorIndex',
  title: '错误页面',
  inject: ['reload'],
  created () {
  },
  methods: {
    handleTest () {
      this.reload()
      this.message({
        content: '我是一个测试的提示消息',
        type: 'error',
        duration: 10000
      })
    }
  }
}
</script>

<style scoped lang="scss">
.errorIndex{
  display: flex;
  justify-content: center;
  align-items: center;
  letter-spacing:20px;
  font-size: 400px;
  color: #FFF;
  h1{
    text-shadow: 8px 8px 4px #C1C1C1;
  }
  .describe{
    letter-spacing:2px;
    font-size: 20px;
    color: #C1C1C1;
    text-align: center;
  }
}
</style>
